<%--
  Created by IntelliJ IDEA.
  User: Administrator
  Date: 2024-06-06
  Time: 14:34
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>登录界面</title>
</head>
<style>
    .top {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: 10em auto;
        width: 500px;
        background-color: #139be1;
        border-radius: 5px;
    }

    .login {
        padding: 10px;
        margin: 10px;
    }
    .login h1{
        text-align: center;
        font-size: 20px;
        color: #fff;
    }
    input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{
        color:#FFF;
    }
    input:-webkit-autofill{
        -webkit-transition-delay:9999s;
    }
    input:focus {
        outline: none;
        border:2px solid #FFF;
        border-radius: 0.2em;
    }

    .login input {
        color: #fff;
        width: 200px;
        height: 30px;
        border: 1px solid #fff;
        border-radius: 5px;
        font-size: 15px;
        font-weight: bold;
        background-color:#139be1;  ;
        padding: 15px 10px 15px 10px;
        margin-bottom: 10px;
        display: block;
    }

    .check {
        display: flex;
        justify-content: center;
        align-items: center;
        margin: auto;
        width: 100%;
    }

    .check .mit {
        width: 50px;
        height: 50px;
        color: #fff;
        background-color: #139be1;
        border: 1px solid #fff;
        display: inline-block;
        padding: 10px 5px 10px 5px;
        margin: 5px;
    }
</style>
<%--
 题目一：创建index1.jsp，index2.jsp页面，在index1.jsp中编写表单信息，通过按钮提交表单信息至index2.jsp中，通过jdbc校验用户名和密码后，实现登录功能，并在登录成功后要跳转至index2.jsp页面。

index1.jsp表单中包含：用户名输入框、密码输入框、提交按钮

index2.jsp页面上需展示成：xxx，登录成功！
 --%>
<body>
<div class="top">
    <form action="${pageContext.request.contextPath}/JspServlet?method=userLogin" method="post" class="login">
        <h1>登录界面</h1>
        <input type="text" name="username" placeholder="请输入用户名：">
        <input type="text" name="password" placeholder="请输入密码：">
        <div class="check">
            <input type="reset" name="submit" value="重输" class="mit">
            <input type="submit" name="submit" value="提交" class="mit">
        </div>
    </form>
</div>
</body>
</html>
